<template>
	<view class="page">
		<view class="title">
			3.15.watch和watchEffect监听的使用
		</view>
		<view class="p">
			官网链接API
			<uni-link href="https://cn.vuejs.org/guide/essentials/watchers.html" text="watch监听器"
				color="#007BFF"></uni-link>
		</view>
		<view class="p">
			闲虾米的教程只是做了watch的方法使用，个人配上他的教程和文档做了一些个人理解。
		</view>
		<view class="p">
			首先说一下watch的日常使用场景。
		</view>
		<view class="p">
			1 数据变化时执行异步操作 。例如搜索，我想在用户输入时候实时的监听用户输入的关键词，并在做出下一步结果展示的时候会用到watch。
		</view>
		<view class="p">
			2. 数据验证 。最常见的就是用户注册做条件判断，然后根据用户的输入给出提示词，例如手机号码不对，名字不符合长度等。
		</view>
		<view class="p">
			因个人项目开发经验较少，暂时只考虑到这两项。对比下Computed，我总结下个人的理解，共同点两者都依赖于响应式数据的改变（貌似是个废话！），有了数据的改变，Computed得到了一个结果数据，而watch在监听数据的改变后进行下一步的操作，而这个操作的最终结果，未必是数据，也可能是执行某种方法，最终实现页面的功能。
		</view>
		<view class="p">
			个人建议：发送网络请求，需要监听多个数据的变化，或者需要在数据变化时执行一些复杂的逻辑，watch 会更合适。而computed
			则是当你需要根据已有数据派生出一个新的数据，并且这个新数据会被多次使用时使用computed。例如，根据购物车中商品的数量和单价计算总价。而且<text
				class="red bold">计算属性的最终结果最好是只读的！！！</text>
		</view>
	</view>
</template>

<script setup>
	import {
		computed,
		ref
	} from 'vue'

	computed
</script>

<style lang="scss" scoped>

</style>